<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>限时秒杀</title>
    <script src="js/jquery-3.2.1.min.js"></script>
    <style>
        .box{
        margin:0 auto;
        position:relative;
        background:url(images/flash_sale.png);
        width:702px;height:378px;
      }
      .box div{
        float:left;
        width:50px;
        height:50px;
        border:1px solid #ccc;
        margin-left:5px;
        line-height:50px;
        text-align: center;color:red;
        position:relative;
        top:260px;left:305px;
      }
    </style>
</head>
<body>
    <div class="box">
    <div id="d"></div>
    <div id="h"></div>
    <div id="m"></div>
    <div id="s"></div>
    </div>
    <script>
        //设置秒杀结束时间
        //设置从当前时间开始，秒杀结束的时间
        var endtime=new Date(),
        endseconds=endtime.getTime()+60*1000;
        var id=setInterval(seckill,1000);
        function seckill(){
            var nowtime=new Date();
            var remaining =parseInt((endseconds-nowtime.getTime())/1000);
            if(remaining>0){
                d = parseInt(remaining / 86400);        // 计算剩余天数（除以60*60*24取整，获取剩余的天数）
                h = parseInt((remaining / 3600) % 24);  // 计算剩余小时（除以60*60转换为小时，与24取模，获取剩余的小时）
                m = parseInt((remaining / 60) % 60);    // 计算剩余分钟（除以60转为分钟，与60取模，获取剩余的分钟）
                s = parseInt(remaining % 60);           // 计算剩余秒（与60取模，获取剩余的秒数）
                
            }else{
                clearInterval(id);
            }
            $("#d").html(d+"天");
                   $("#h").html(h+"时");
                   $("#m").html(m+"分");
                   $("#s").html(s+"秒")
        }
    </script>
</body>
</html>